﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Desktop.aspx.cs" Inherits="Paltop_v0._1.UI.Desktop" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="../Styles/Desktop/taskbarStyle.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Desktop/StickyNote.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/JQueryUI/ui-lightness/jquery.ui.all.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Desktop/Doc.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Desktop/StickyNoteMenu.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="../Styles/FileManager/fileManager.css"
        media="screen" />
    <link href="../Styles/Calendar/jquery-Calendar.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Calendar/Calendar.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Desktop/taskbarStyle.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Calendar/jquery.bt.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="../Scripts/JQuery/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="../Scripts/JQuery/JQueryUI/jquery.ui.core.js"></script>
    <script type="text/javascript" src="../Scripts/JQuery/JQueryUI/jquery.ui.widget.js"></script>
    <script type="text/javascript" src="../Scripts/JQuery/JQueryUI/jquery.ui.mouse.js"></script>
    <script type="text/javascript" src="../Scripts/JQuery/JQueryUI/jquery.ui.draggable.js"></script>
    <script type="text/javascript" src="../Scripts/JQuery/JQueryUI/jquery.ui.resizable.js"></script>
    <script src="../Scripts/JQuery/JQueryUI/jquery.ui.datepicker.js" type="text/javascript"></script>
    <script src="../Scripts/JQuery/JQueryUI/jquery.ui.position.js" type="text/javascript"></script>
    <script src="../Scripts/JQuery/JQueryUI/jquery.ui.dialog.js" type="text/javascript"></script>
    <!-- BT Libery Scripts -->
    <script src="../Scripts/Calendar/jquery.easing.1.3.js" type="text/javascript"></script>
    <script src="../Scripts/Calendar/jquery.hoverIntent.minified.js" type="text/javascript"></script>
    <script src="../Scripts/Calendar/bgiframe_2.1.1/jquery.bgiframe.min.js" type="text/javascript"></script>
    <!--[if IE]><script src="../Scripts/Calendar/excanvas_r3/excanvas.compiled.js" type="text/javascript"></script><![endif]-->
    <script src="../Scripts/Calendar/jquery.bt.js" type="text/javascript"></script>
    <!-- Enf of BT -->
    <script src="../Scripts/Desktop/doc.js" type="text/javascript"></script>
    <script src="../Scripts/Desktop/StickyNote.js" type="text/javascript"></script>
    <script src="../Scripts/Desktop/clock.js" type="text/javascript"></script>
    <script src="../Scripts/Desktop/LoadComponents.js" type="text/javascript"></script>
    <script src="../Scripts/Calendar/Our%20Scripts/Calendar.js" type="text/javascript"></script>
    <% Response.Write("<script type=\"text/javascript\">");
       Response.Write("var stickyNoteLoaded=" + (StickyNotes == "" ? "false" : "true") + ";");
       Response.Write("var stickyNoteCount=" + numberOfSNotes + ";");
       Response.Write("</script>");
    %>
    <style type="text/css">
        #mask
        {
            position: absolute;
            left: 0;
            top: 0;
            z-index: 9000;
            display: block;
        }
        .UserControllerHeader
        {
            height:25px;
            margin-left:8px;
            overflow:hidden;
            text-decoration:none;
            width:1001px;
            border-top-left-radius:5px;
            border-top-right-radius:5px;
            background-color:#DDDDDD;
            }
    </style>
</head>
<body onload="updateClock(); setInterval('updateClock()', 1000 )">
    <form id="form1" runat="server">
    <div class="statusbar">
        <ul class="menu">
            <li>
                <div id="userID">
                    <a href="#">
                        <asp:Literal ID="user" runat="server"></asp:Literal></a>
                </div>
            </li>
            <li class="sep">| </li>
            <li id="logout">
                <asp:ImageButton ID="logoutButton" runat="server" ImageUrl="../TemplateImages/Desktop/logout.ico"
                    OnClick="LogoutClick" />
                <div class="overlay">
                </div>
            </li>
            <li class="sep rig">| </li>
            <li id="timeDate"><a href="#"><span id="clock">&nbsp;</span></a> </li>
            <li class="sep rig">| </li>
        </ul>
    </div>
    <div id="desktopArea">
        <% Response.Write(StickyNotes); %>
        <div id="mask">
        </div>
        <div class="StickyNoteMenu">
            <ul>
                <li><a href="#" onclick="StickyNoteSelectAll()">Select All</a></li>
                <li><a href="#" onclick="StickyNoteChangeStyle()">Change Style</a></li>
                <li><a href="#" onclick="StickyNoteMinimize()">Minimize</a></li>
            </ul>
        </div>
        <!-- Calendar Code -->
        <div id="calendar" class="Calendar">
            <div class="TopofCalendar">
            </div>
            <div id="datepicker">
                <center>
                    <a id="changeYear" href="#" style="text-align: center">Change Year</a></center>
            </div>
            <div id="oneDayView" class="OneDayView">
                <div id="datePart">
                    <div id="firstCalendarRow">
                        <span id="dayName"></span>
                    </div>
                    <div id="secondCalendarRow">
                        <span id="dateOfMounth"></span>
                    </div>
                    <div id="thirdCalendarRow">
                        <span id="month"></span><span id="year"></span>
                        <br />
                    </div>
                </div>
                <div id="eventView">
                    <div id="showEvents">
                        <a id="showEventButton" href="#"><span id="showEventText">Show Events</span><br />
                            <img id="showEventImage" src="../TemplateImages/eventSlideDown.png" alt="" /></a></div>
                    <div id="eventList">
                        <ul id="eventContainer">
                        </ul>
                        <center>
                            <img id="ajaxLoader" src="../TemplateImages/ajax-loader%20-Calendar2.gif" style="display:none;" />
                        </center>
                        <a id="newEventButton" href="#">Create new event</a>
                    </div>
                    <div id="newEventPart">
                    </div>
                </div>
            </div>
        </div>
        <div id="newEvent" class="Dialog" title="Event">
            <input id="inputEventId" type="hidden" />
            <ul>
                <li>Name:<br />
                    <input type="text" id="inputEventName" />
                </li>
                <li>Descirption:<br />
                    <textarea rows="3" cols="20" id="inputEventDesc"></textarea>
                </li>
                <li>Location:<br />
                    <input type="text" id="inputEventLocation" />
                </li>
                <li>EventType:<br />
                    <asp:DropDownList ID="eventType" runat="server" ClientIDMode="Static" DataSourceID="EventTypeDateSource"
                        DataTextField="EventName" DataValueField="EventTypeID">
                    </asp:DropDownList>
                </li>
                <li>Start Date:<br />
                    <input type="text" id="inputEventStartDate" />
                </li>
                <li>Start Time:<br />
                    <select id="inputEventStartTime">
                    </select>
                </li>
                <li>End Date:<br />
                    <input type="text" id="inputEventEndDate" disabled="disabled" />
                </li>
                <li>End Time:<br />
                    <select id="inputEventEndTime">
                    </select>
                </li>
            </ul>
        </div>
        <div style="display: none">
            <ul>
                <li class="eventElement" id="eventID">
                    <img src="../TemplateImages/EventTypeIcon/1.png" /><img alt="Edit" id="Img2" src="../TemplateImages/pencil.ico"
                        class="DeleteEditIcon EditEvent" /><img alt="Delete" id="Img3" src="../TemplateImages/gnome_edit_delete.ico"
                            class="DeleteEditIcon DeleteEvent" />
                </li>
            </ul>
        </div>
        <div id="eventDesc" class="Dialog" title="test">
            <ul>
                <li><b>Start Date: </b><span id="dialogStartDate"></span></li>
                <li><b>Start Time: </b><span id="dialogStartTime"></span></li>
                <li><b>End Date: </b><span id="dialogEndDate"></span></li>
                <li><b>End Time: </b><span id="dialogEndTime"></span></li>
                <li><b>Location: </b><span id="dialogLocation"></span></li>
                <li><b>Description:</b><span id="dialogDescription"></span></li>
            </ul>
        </div>
        <asp:EntityDataSource ID="EventTypeDateSource" runat="server" ConnectionString="name=PaltopDatabaseEntities"
            DefaultContainerName="PaltopDatabaseEntities" EnableFlattening="False" EntitySetName="EventTypes"
            Select="it.[EventTypeID], it.[EventName]">
        </asp:EntityDataSource>
        <!-- End of Calendar -->
    </div>
    <div class="dock" id="dock2">
        <div class="dock-container2">
            <a class="dock-item2" href="#"><span>Control Panel</span><img alt="" src="../TemplateImages/Desktop/control%20panel-taskbar.png" onclick=" UserControlPanelClick()" /></a>
            <a class="dock-item2" href="#"><span>File Manager</span><img alt="" src="../TemplateImages/Desktop/file%20manager-taskbar.png"
                onclick="fileManagerClicked()" /></a> <a class="dock-item2" href="#"><span>File Share</span><img
                    alt="" src="../TemplateImages/Desktop/fileshare-taskbar.png" /></a> <a class="dock-item2"
                        href="#"><span>Messeging</span><img alt="" src="../TemplateImages/Desktop/messaging-taskbar.png" /></a>
            <a class="dock-item2" href="#"><span>Sticky Note</span><img alt="" src="../TemplateImages/Desktop/sticky%20note-taskbar.png"
                onclick="StickyNoteClicked()" /></a> <a onclick="RSSClick()" class="dock-item2" href="#"><span>RSS Reader</span><img
                    alt="Zzzzz" src="../TemplateImages/aaron.jpg" /></a>
            <a class="dock-item2" href="#"><span>Word Processor</span><img alt="" src="../TemplateImages/Desktop/word%20processor-taskbar.png" /></a>
            <a class="dock-item2" href="#" id="calendarDocItem"><span>Calendar</span><img alt=""
                src="../TemplateImages/Desktop/callender-taskbar.ico" /></a>
        </div>
        <script type="text/javascript">

            $(document).ready(
		function () {
		    $('#dock2').Fisheye(
				{
				    maxWidth: 50,
				    items: 'a',
				    itemsText: 'span',
				    container: '.dock-container2',
				    itemWidth: 50,
				    proximity: 80,
				    alignment: 'left',
				    valign: 'bottom',
				    halign: 'center'

				}

			)
		    $("#calendarDocItem").toggle(showCalendar, hideCalendar);
		    $("#calendar").hide();

		}
	);

            function CalendarClicked() {



            }

            function hideCalendar() {

                $("#calendar").hide();

            }

            function showCalendar() {
                $("#calendar").show();

            }



        </script>
    </div>
    </form>
    <script type="text/javascript">
        function fileManagerMax() {

            $("#FileManager").toggleClass("Maximize");

        }

    </script>
</body>
</html>
